<template>
    <div class="fillcontain">
        <div class="">
            <el-form :model="formData" inline="true" ref="formData"
            >
                <el-row>
                    <el-col :span="16">
                        <el-form-item label="学校名称">
                            <el-input
                                size="mini"
                                placeholder="学校名称"
                                prefix-icon="el-icon-search"
                                v-model="formData.name">
                            </el-input>
                        </el-form-item>
                        <el-button @click="initData" type="primary" icon="el-icon-search">搜索</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>

        <div class="table_container">
            <el-table
                :data="tableData"
                highlight-current-row
                style="width: 100%">

                <el-table-column
                    property="name"
                    label="校区名称"
                    min-width="10%">
                </el-table-column>
                <el-table-column
                    property="mastername"
                    label="校长姓名"
                    min-width="10%">
                </el-table-column>

                <el-table-column
                    property="masternick"
                    label="校长昵称"
                    min-width="10%">
                </el-table-column>
               <!-- <el-table-column
                    property="pschoolid"
                    label="所属学校"
                    min-width="10%">
                </el-table-column>-->
                <el-table-column
                    property="teachers"
                    label="操作"
                    min-width="10%">
                    <template scope="scope">
                        <el-button @click="deleteSch(scope.$index,scope.row)" type="text" size="small">删除</el-button>
                    </template>
                </el-table-column>

            </el-table>
            <div class="Pagination" style="text-align: left;margin-top: 10px;">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-size="20"
                    layout="total, prev, pager, next"
                    :total="count">
                </el-pagination>
            </div>
        </div>
    </div>
</template>

<script>
    import headTop from '../components/headTop'
    import {querySchool,deleteSchool} from '@/api/getData'

    export default {
        data() {
            return {
               formData:{
                   name:'',
               },
                tableData: [],
                currentRow: null,
                offset: 0,
                limit: 10,
                count: 0,
                currentPage: 1,
            }
        },
        components: {
            headTop,
        },
        created() {
            this.initData();
        },
        methods: {
            async initData() {
                const v = await querySchool({
                    "data": {
                        "pageno": this.currentPage,
                        "pagesize": this.limit,
                        "name": this.formData.name
                    }
                });
                this.tableData = [];
                var list = v.data.values;
                this.count = v.data.totalCount;
                list.forEach(item => {
                    const tableData = {};
                    tableData.id = item.id;
                    tableData.name=item.name;
                    tableData.mastername = item.mastername;
                    tableData.masternick = item.masternick;
                    tableData.pschoolid = item.pschoolid;
                    this.tableData.push(tableData);
                })
            },
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
            },
            handleCurrentChange(val) {
                this.currentPage = val;
                this.offset = (val - 1) * this.limit;
                this.getUsers()
            },
            async deleteSch(a, row) {
                this.$confirm('此操作将永久删除该记录, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.confirmdelete(row);
                });
            },
            async confirmdelete(row) {
                var data = {"data": {"id": row.id}}
                await deleteSchool(data)
                this.initData();
                this.$message({
                    type: 'success',
                    message: '删除成功'
                });
            },

        },
    }
</script>

<style lang="less">
    @import '../style/mixin';

    .table_container {
        padding: 20px;
    }
</style>
